import React, { Component } from 'react';
import "../../styles/Index/Mine.scss"
import beijing from "../../img/mines.webp"
import touxiang from "../../img/touxiang.gif"

import { List, Toast } from 'antd-mobile'

class Mine extends Component {
    toLogin() {
        this.props.history.push('/login')
    }
    gocollection(){
        this.props.history.push('/collection')
    }
    signout(){
        localStorage.removeItem('token')
        localStorage.removeItem('id')
        this.props.history.push('/login')
        Toast.show({ content: '成功退出' })
    }
    render() {
        return (
            <div className='mine'>
                <img src={beijing} alt="" />
                <div className='touxiang'>
                    <img src={touxiang} alt="" />
                    <button onClick={() => { this.toLogin() }}>登录</button>
                </div>
                <div className='main'>
                    <List>
                        <List.Item onClick={() => { }}>
                            我的订单
                        </List.Item>
                    </List>
                    <List>
                        <List.Item onClick={() => { this.gocollection() }}>
                            我的收藏
                        </List.Item>
                    </List>
                    <List>
                        <List.Item onClick={() => { }}>
                            收货地址
                        </List.Item>
                    </List>
                    <List>
                        <List.Item onClick={() => { }}>
                            会员中心
                        </List.Item>
                        <List.Item onClick={() => { }}>
                            领券中心
                        </List.Item>
                        <List.Item onClick={() => { }}>
                            我的评价
                        </List.Item>
                        <List.Item onClick={() => { this.signout()}}>
                            退出登录
                        </List.Item>
                    </List>


                </div>
            </div>
        );
    }
}

export default Mine;